<css file="__JS__/zTree/css/zTreeStyle/zTreeStyle.css"/>
<js file="__JS__/zTree/js/jquery.ztree.all.min.js"/>
<ul id="authTree" class="ztree"></ul>
<script LANGUAGE="JavaScript">
    var zTreeObj, checkids;
    // zTree 的参数配置，深入使用请参考 API 文档（setting 配置详解）
    function pullChecked(treeId) {
        var checks = $.fn.zTree.getZTreeObj(treeId).getCheckedNodes(true);
        var tmp = [];
        for (var k in checks) {
            tmp.push(checks[k].id);
        }
        checkids = tmp;
    }
    var setting = {
        check: {
            enable: true
        },
        data: {
            simpleData: {
                enable: true,
                pIdKey: 'pid',
            }
        },
        callback: {
            onClick: function (event, treeId, treeNode) {
                $.fn.zTree.getZTreeObj(treeId).checkNode(treeNode, !treeNode.checked, true, true);
            },
            onCheck: function (event, treeId, treeNode) {
                pullChecked(treeId);
            }
        },
    };
    // zTree 的数据属性，深入使用请参考 API 文档（zTreeNode 节点数据详解）
    var zNodes = {$lists|json_encode};
    $(document).ready(function () {
        zTreeObj = $.fn.zTree.init($("#authTree"), setting, zNodes);
        $.fn.zTree.getZTreeObj("authTree").expandAll(true);
        pullChecked('authTree');
    });
</script>
<a href="{:U('groupAdd')}" class="layui-btn layui-btn-sm layui-btn-normal" data-option="{
    data:{
        id: {$info.id},
        rules:checkids.join(','),
    },
    type:'post',
}" ajaxGet>提交</a>